<template>
  <!--页面整体大框-->
  <div class="first">
    <!--第一部分搜索条件及按钮-->
    <div class="one" style="display: inline-block ">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true"  >

      <!--左半部分搜索条件 -->
      <div class="one-left" style="display: inline-block">
      <el-form-item label="日期"  prop="entryName">
        <el-date-picker
          v-model="dateRange"
          type="datetimerange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>

      <el-form-item label="部门：" prop="department">
        <el-select v-model="queryParams.department" placeholder="请选择部门" clearable style="width: 210px" >
          <el-option
            v-for="dict in dict.type.yqg_department"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>

      <el-form-item label="班次：" prop="sailings">
        <el-select v-model="queryParams.sailings" placeholder="请选择班次" clearable style="width: 210px" >
          <el-option
            v-for="dict in dict.type.yqg_sailings_signs"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="结账方式：" prop="paymentMethod">
        <el-select v-model="queryParams.paymentMethod" placeholder="请选择结账方式" clearable style="width: 210px" >
          <el-option
            v-for="dict in dict.type.yqg_payment_method"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>

      <el-form-item label="单据号：" prop="danjuhao">
        <el-input
          v-model="queryParams.danjuhao"
          placeholder="请输入单据号"
          clearable
          style="width: 210px"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>

      <el-form-item label="台号：" prop="barNumber">
        <el-input
          v-model="queryParams.barNumber"
          placeholder="请输入台号"
          clearable
          style="width: 210px"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>

      <el-form-item label="收银员：" prop="operator">
        <el-input
          v-model="queryParams.operator"
          placeholder="请输入收银员"
          clearable
          style="width: 210px"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      </div>
    </el-form>
    <el-form>
      <el-form-item  style="text-align: right;">
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
        <el-button type="suceess" icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
      </el-form-item>
    </el-form>

    <!-- <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
         <el-button
           type="primary"
           plain
           icon="el-icon-plus"
           size="mini"
           @click="handleAdd"
           v-hasPermi="['project:room:add']"
         >新增</el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
           type="success"
           plain
           icon="el-icon-edit"
           size="mini"
           :disabled="single"
           @click="handleUpdate"
           v-hasPermi="['project:room:edit']"
         >修改</el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
           type="danger"
           plain
           icon="el-icon-delete"
           size="mini"
           :disabled="multiple"
           @click="handleDelete"
           v-hasPermi="['project:room:remove']"
         >删除</el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
           type="warning"
           plain
           icon="el-icon-download"
           size="mini"
           @click="handleExport"
           v-hasPermi="['project:room:export']"
         >导出</el-button>
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" ></right-toolbar>
     </el-row>
     -->
      <div class="tow">
    <el-table  :data=" billsList"  border @selection-change="handleSelectionChange"
               max-height="600px" style="width: 100% ;overflow-x: auto;" >
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column type="index" label="序号"  :index="indexMethod" align="center"
      ></el-table-column>
      <el-table-column prop="handBrand" align="center"  label="手牌号"></el-table-column>
      <el-table-column prop="handCategory" align="center"  label="类"></el-table-column>

      <el-table-column prop="jie" align="center"  label="结"></el-table-column>
      <el-table-column prop="danjuhao" align="center"  label="单据号"></el-table-column>

      <el-table-column prop="numberOfPeople" align="center"  label="人数"></el-table-column>
      <el-table-column prop="paymentMethod" align="center"  label="币种"></el-table-column>

      <el-table-column prop="he" align="center"  label="核"></el-table-column>
      <el-table-column prop="userId" align="center"  label="会员卡"></el-table-column>

      <el-table-column prop="totalConsumptionAmount" align="center"  label="应收金额"></el-table-column>
      <el-table-column prop="discountAmount" align="center"  label="折扣额"></el-table-column>

      <el-table-column prop="zengSong" align="center"  label="赠送"></el-table-column>

      <el-table-column prop="paidInAmount" align="center"  label="实收金额"></el-table-column>

      <el-table-column prop="biao" align="center"  label="标"></el-table-column>
      <el-table-column prop="teShuKaJinE" align="center"  label="特殊卡金额"></el-table-column>

      <el-table-column prop="cardNumber" align="center"  label="会员卡号"></el-table-column>

      <el-table-column prop="guaZhangDanWei" align="center"  label="挂账单位"></el-table-column>
      <el-table-column prop="MolingJinE" align="center"  label="抹零金额"></el-table-column>
      <el-table-column prop="faPiao" align="center"  label="发票"></el-table-column>
      <el-table-column prop="FenDanBiaoZhi" align="center"  label="分单标志"></el-table-column>
      <el-table-column prop="LiuPai" align="center"  label="留牌"></el-table-column>

      <el-table-column prop="openingTime" align="center"  label="开牌时间"></el-table-column>
      <el-table-column prop="checkoutTime" align="center"  label="结账时间"></el-table-column>
      <el-table-column prop="checkout" align="center"  label="结账人"></el-table-column>

      <el-table-column prop="zheKouFangAn" align="center"  label="折扣方案"></el-table-column>
      <el-table-column prop="zheKouLv" align="center"  label="折扣率"></el-table-column>

      <el-table-column prop="department" align="center"  label="部门"></el-table-column>
      <el-table-column prop="sailings" align="center"  label="班次"></el-table-column>
      <el-table-column prop="groupId" align="center"  label="团体号"></el-table-column>

      <el-table-column prop="liuShuiHao" align="center"  label="流水号"></el-table-column>
      <el-table-column prop="fuKuanXinXi" align="center"  label="付款信息"></el-table-column>


      <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width" width="160">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="dialogVisible = true"
          >详情</el-button>
          <!--<el-button
              size="mini"
              type="text"
              icon="el-icon-delete"
              @click="handleDelete(scope.row)"
              v-hasPermi="['project:room:remove']"
            >删除</el-button> -->
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
      </div>


  <!--详情页展示-->
    <el-dialog
      title="结账单明细"
      :visible.sync="dialogVisible"
      width="80%"
      :before-close="handleClose">


      <template>
        <div class="app-container">
          <div>
            <el-row>入场时间： </el-row>
            <el-row>离场时间：</el-row>
            <el-row>结账手牌：</el-row>

            <!--  <el-table v-loading="loading" :data="billsList , tableData"  border @selection-change="handleSelectionChange" style="overflow-x: auto;">
                <el-table-column type="selection" width="55" align="center" />
                <el-table-column type="index" label="序号" width="55" :index="indexMethod" align="center"></el-table-column>
                <el-table-column prop="handBrand" align="center" sortable :sort-method="sortById" label="手牌"></el-table-column>
              </el-table> -->
          </div>

          <el-container>
            <el-main>
              <div class="textout"  >
                <div class="text1" >
                  <el-row class="button-list1">
                    <div >
                      <span >消费清单 : </span>
                      <el-divider class="divide"></el-divider>
                    </div>
                    <el-table  :data="billsList"  border    @selection-change="handleSelectionChange"   >

                      <el-table-column type="index" label="序号"  :index="indexMethod" align="center" width="55" ></el-table-column>
                      <el-table-column prop="handBrand" align="center"  label="手牌" ></el-table-column>
                      <el-table-column prop="originalHand" align="center"  label="原手牌" ></el-table-column>
                      <el-table-column prop="entryName" align="center"  label="消费项目"></el-table-column>

                      <el-table-column prop="zengSong" align="center"  label="赠送"></el-table-column>

                      <el-table-column prop="quantity" align="center"  label="数量"></el-table-column>
                      <el-table-column prop="unitPrice" align="center"  label="单价"></el-table-column>
                      <el-table-column prop="totalAmount" align="center"  label="金额"></el-table-column>
                      <el-table-column prop="discountAmount" align="center"  label="折扣"></el-table-column>
                      <el-table-column prop="commissionPrice" align="center"  label="提成"></el-table-column>

                      <el-table-column prop="note1" align="center"  label="说明"></el-table-column>

                      <el-table-column prop="barNumber" align="center"  label="吧台"></el-table-column>
                    </el-table>
                    <div style="background: #F8F8F9;width: 100%;height: 44px">
                      <el-row>
                        <el-col :span="6" ><div style="margin-top: 12px;margin-left: 140px">商品数量：</div></el-col>
                        <el-col :span="6"><div style="margin-top: 12px;margin-right: 140px">{{ quantity }}个</div></el-col>
                        <el-col :span="6"><div style="margin-top: 12px;margin-left: 140px">合计金额：</div></el-col>
                        <el-col :span="6"><div style="margin-top: 12px;margin-right: 140px">{{ amount }}元</div></el-col>
                      </el-row>
                    </div>

                    <div class="paint" style="margin-top: 10px;text-align: center">

                      <el-table v-loading="loading" :data="billsList "  border  show-summary @selection-change="handleSelectionChange" >

                        <el-table-column type="index" label="序号" :index="indexMethod" align="center" width="55" ></el-table-column>
                        <el-table-column prop="handBrand" align="center"  label="手牌" ></el-table-column>
                        <el-table-column prop="originalHand" align="center"  label="原手牌" ></el-table-column>
                        <el-table-column prop="entryName" align="center"  label="消费项目"></el-table-column>

                        <el-table-column prop="zengSong" align="center"  label="赠送"></el-table-column>

                        <el-table-column prop="quantity" align="center"  label="数量"></el-table-column>
                        <el-table-column prop="unitPrice" align="center"  label="单价"></el-table-column>
                        <el-table-column prop="totalAmount" align="center"  label="金额"></el-table-column>
                        <el-table-column prop="discountAmount" align="center"  label="折扣"></el-table-column>
                        <el-table-column prop="commissionPrice" align="center"  label="提成"></el-table-column>

                        <el-table-column prop="cardNumber" align="center"  label="说明"></el-table-column>

                        <el-table-column prop="barNumber" align="center"  label="吧台"></el-table-column>
                      </el-table>
                      <div style="background: #F8F8F9;width: 100%;height: 44px">
                        <el-row>
                          <el-col :span="6" ><div style="margin-top: 12px;margin-left: 140px">商品数量：</div></el-col>
                          <el-col :span="6"><div style="margin-top: 12px;margin-right: 140px">{{ quantity }}个</div></el-col>
                          <el-col :span="6"><div style="margin-top: 12px;margin-left: 140px">合计金额：</div></el-col>
                          <el-col :span="6"><div style="margin-top: 12px;margin-right: 140px">{{ amount }}元</div></el-col>
                        </el-row>
                      </div>

                      <pagination
                        v-show="total>0"
                        :total="total"
                        :page.sync="queryParams.pageNum"
                        :limit.sync="queryParams.pageSize"
                        @pagination="getList"
                      />
                    </div>
                  </el-row>
                </div>
              </div>

            </el-main>



            <el-container>
              <el-aside>
                <div>
                  <span style="margin-bottom: 1px">付款清单 : </span>
                  <el-divider class="divide"></el-divider>
                </div>
                <el-table
                  :data="billsList"
                  border
                  show-summary
                  style="width: 100%;"
                  height="542px">
                  <el-table-column
                    prop="operator"
                    label="收银员"
                  >
                  </el-table-column>
                  <el-table-column
                    prop="paymentMethod"
                    label="付款方式">
                  </el-table-column>

                  <el-table-column
                    prop="amount1"
                    label="押金">
                  </el-table-column>

                  <el-table-column
                    prop="paidInAmount"
                    label="收款金额">
                  </el-table-column>

                  <el-table-column
                    prop="amount3"
                    label="挂账单位">
                  </el-table-column>
                  <el-table-column
                    prop="amount4"
                    label="挂账名称">
                  </el-table-column>

                  <el-table-column
                    prop="checkoutTime"
                    label="交易时间"
                  >
                  </el-table-column>
                </el-table>

                <!--     <div style="width: 100%;height: 44px">
                       <el-row>
                         <el-col :span="12"><div style="margin-top: 12px;margin-left: 140px">合计金额：</div></el-col>
                         <el-col :span="12"><div style="margin-top: 12px;margin-right: 140px">{{ amount }}元</div></el-col>
                       </el-row>
                     </div> -->
                <div class="paint" style="margin-top: 10px;">
                  <div>
                    <span style="margin-bottom: 1px">退款清单 : </span>
                    <el-divider class="divide"></el-divider>
                  </div>
                  <el-table
                    :data="billsList"
                    border
                    show-summary
                    height="542"
                    :summary-method="getSummaries"
                    style="width: 100%; margin-top: 20px; "
                  >

                    <el-table-column
                      prop="id"
                      label="消费名称"
                    >
                    </el-table-column>

                    <el-table-column
                      prop="unit"
                      label="单位">
                    </el-table-column>
                    <el-table-column
                      prop="unitPrice"
                      label="单价">
                    </el-table-column>
                    <el-table-column
                      prop="quantity"
                      label="数量">
                    </el-table-column>

                    <el-table-column
                      prop="amount3"
                      label="票号">
                    </el-table-column>

                    <el-table-column
                      prop="checkoutTime"
                      label="时间"
                    >
                    </el-table-column>
                  </el-table>
                  <!--      <div style="background: #F8F8F9;width: 100%;height: 44px">
                        <el-row>
                           <el-col :span="12"><div style="margin-top: 12px;margin-left: 140px">合计金额：</div></el-col>
                           <el-col :span="12"><div style="margin-top: 12px;margin-right: 140px">{{ amount }}元</div></el-col>
                         </el-row>
                       </div> -->
                </div>
              </el-aside>
            </el-container>

          </el-container>

        </div>
      </template>
      <span slot="footer" class="dialog-footer">
         <el-button @click="dialogVisible = false">取 消</el-button>
         <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
       </span>
    </el-dialog>

  </div>
  </div>
</template>
<script>

import { listBills, getBills, delBills, addBills, updateBills } from "@/api/module/zxy/xieba";
import {addDetails, getDetails, listDetails, updateDetails,delDetails} from "@/api/module/zxy/xspz";
import { listRoom, getRoom, delRoom, addRoom, updateRoom } from "@/api/module/zxy/room";
export default {
  name: "index2",
  dicts: ['yqg_hand_category', 'yqg_hand_state', 'yqg_retention_status', 'yqg_post', 'yqg_department', 'yqg_merge_status','yqg_payment_method',
    'yqg_sailings_signs'],
  data() {
    return {
      //详情相关
      dialogVisible: false,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 吧台账单表格数据
      billsList: [],
      //消费详情账单表格数据
      detailsList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数

      // 部门名称
      deptName: undefined,
      // 默认密码
      initPassword: undefined,
      // 日期范围
      dateRange: [],
      // 岗位选项
      postOptions: [],
      // 角色选项
      roleOptions: [],

      // 合计
      amount: 0, // 总价格
      quantity: 0, // 总数量

      queryParams: {
        pageNum: 1,
        pageSize: 10,
        userId: null,
        deptId: null,
        nickName: null,
        department: null,
        userName: null,
        post: null,
        handBrand: null,
        originalHand: null,
        handCategory: null,
        retentionStatus: null,
        mergeStatus: null,
        handState: null,
        numberOfPeople: null,
        allCost: null,
        openingTime: null,
        groupId: null,
        oddNumbers: null,
        children: null,
        mastercard: null,
        handoverTime: null,
        handoverStatus: null,
        barNumber: null,
        sailings: null,
        together: null,
        note: null,
        groupNotes: null,
        discountAmount: null,
        checkoutTime: null,
        supplementaryConsumption: null,
        paidInAmount: null,
        paidInCash: null,
        changeAmount: null,
        paymentMethod: null,
        totalConsumptionAmount: null,
        cardiner: null,
        checkout: null,
        frontSign: null,
        frontPrintTime: null,
        operator: null,
        checkoutLocation: null,
        note1: null,
        note2: null,
        note3: null,
        note4: null,
        note5: null,
        note6: null,
        note7: null,
        note8: null,
        note9: null,
        note10: null,


        /*      pageNum: 1,
              pageSize: 10,

              userId: null,
              deptId: null,
              department: null,
              nickName: null,
              userName: null,
              post: null,
              handBrand: null,
              handCategory: null,
              handState: null,
              retentionStatus: null,
              mergeStatus: null,
              openingTime: null, */
        drawTime: null,
        mergeHands: null,
        mergeBarBillsId: null,
        leaveTime: null,
        beforeLeave: null,
        beforeBarBillsId: null,
        entryName: null,
        projectCategory: null,
        projectCode: null,
        mnemonicCode: null,
        unit: null,
        unitPrice: null,
        commissionPrice: null,
        //    together: null,
        sailingsSigns: null,
        barBillsId: null,
        recordingTime: null,
        quantity: null,
        totalAmount: null,
        seat: null,
        orderNumber: null,
        //      paymentMethod: null,
        consumptionStatus: null,
        chargebackTime: null,
        reasonForChargeback: null,
        chargebackProcessorAccount: null,
        chargebackProcessorName: null,
        clockTime: null,
        nextClockTime: null,
        nextClockStatus: null,
        recordEmployeeNumber: null,
        recorderEmployeeName: null,
        roomType: null,
        openingHours: null,
        checkOutTime: null,
        checkOutStatus: null,
        /*      note1: null,
              note2: null,
              note3: null,
              note4: null,
              note5: null,
              note6: null,
              note7: null,
              note8: null,
              note9: null,
              note10: null */

      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
      }
    };
  },
  created() {
    const handBrand = this.$route.query.handBrand;
    console.log("参数："+handBrand);
    console.log(typeof (handBrand ));
    this.queryParams.handBrand=handBrand.toString();
    if( this.queryParams.handBrand!==""&& this.queryParams.handBrand!==null) {
      console.log(typeof (this.queryParams.handBrand));
      this.getDetailsList();
    }
  },
  //排序
  methods: {
    sortById(a,b){
      if(parseInt(a.handBrand)>parseInt(b.handBrand)) {
        return -1
      }
    },
    sortByTeam(a,b){
      if(parseInt(a.groupId)>parseInt(b.groupId)) {
        return -1
      }
    },

    /** 查询吧台账单列表 */
    getList() {
      this.loading = true;
      listBills(this.queryParams).then(response => {
        this.billsList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },

    /** 查询消费详细列表 */
    getList1() {
      this.loading = true;
      listDetails(this.queryParams).then(response => {
        this.detailsList = response.rows;
        this.amount = 0
        this.quantity = 0
        for (let i = 0; i < this.detailsList.length; i++) {
          if(this.detailsList[i].consumptionStatus==="0"){
            this.quantity +=parseInt(this.detailsList[i].quantity)
            this.amount +=parseInt(this.detailsList[i].totalAmount)
          }

        }
        this.total = response.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        pageNum: 1,
        pageSize: 10,
        userId: null,
        deptId: null,
        department: null,
        nickName: null,
        userName: null,
        post: null,
        handBrand: null,
        handCategory: null,
        handState: null,
        retentionStatus: null,
        mergeStatus: null,
        openingTime: null,
        drawTime: null,
        mergeHands: null,
        mergeBarBillsId: null,
        leaveTime: null,
        beforeLeave: null,
        beforeBarBillsId: null,
        entryName: null,
        projectCategory: null,
        projectCode: null,
        mnemonicCode: null,
        unit: null,
        unitPrice: null,
        commissionPrice: null,
        together: null,
        sailingsSigns: null,
        barBillsId: null,
        recordingTime: null,
        quantity: null,
        totalAmount: null,
        seat: null,
        orderNumber: null,
        paymentMethod: null,
        consumptionStatus: null,
        chargebackTime: null,
        reasonForChargeback: null,
        chargebackProcessorAccount: null,
        chargebackProcessorName: null,
        clockTime: null,
        nextClockTime: null,
        nextClockStatus: null,
        recordEmployeeNumber: null,
        recorderEmployeeName: null,
        roomType: null,
        openingHours: null,
        checkOutTime: null,
        checkOutStatus: null,
        note1: null,
        note2: null,
        note3: null,
        note4: null,
        note5: null,
        note6: null,
        note7: null,
        note8: null,
        note9: null,
        note10: null
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      console.log(this.queryParams.projectCategory)
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.ID)
      this.single = selection.length!==1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加消费详情";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const ID = row.ID || this.ids
      getDetails(ID).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "修改消费详情";
      });
    },
    indexMethod(index) {
      index = (index + 1) + (this.queryParams.pageNum - 1) * this.queryParams.pageSize
      return index
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.ID != null) {
            updateDetails(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addDetails(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const IDs = row.ID || this.ids;
      this.$modal.confirm('是否确认删除消费详细编号为"' + IDs + '"的数据项？').then(function() {
        return delDetails(IDs);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
    },

    /** 导出按钮操作 */
    handleExport() {
      // // if (this.startTime === '' || this.endTime === '' || this.startTime === null || this.endTime == null) {     /** 这里要走一遍判断，若均为空则返回空 */
      // //   return
      // // }
      // // this.queryParams.note1 = this.startTime.getTime()
      // // this.queryParams.note2 = this.endTime.getTime()
      // this.download('project/zxy/xspz/export', {  //改一下位置，其他不用改
      //   ...this.queryParams
      // }, `结账单明细表_${new Date().getTime()}.xlsx`)//导出表下载时的表名
    },

    handleClose(done) {
      this.$confirm('确认关闭？')
        .then(_ => {
          done();
        })
        .catch(_ => {});
    }

  }
};
</script>
<style>
/*大框样式*/
.first {
  display: flex;
  flex-direction: column;
  margin-left: 1%;
  margin-right: 1%;
  margin-bottom: 1%;
}

/*搜索行样式*/
.one {
  display: inline-block;
  margin-top: 2%;
  height: 20%;
  width: 100%;
}

.tow {
  margin-top: 5px;
}

#app {
  font-family: "Avenir", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.allpage{
  /*position: fixed;*/
  margin-left: 5px;
  margin-right: 5px;

}
.el-header{
  margin-left: 10px;
  margin-right: 10px;
  margin-bottom: 5px;
  /* background-color: #FFFFFF;*/
}

/**详情页的大框*/
.el-aside {
  /** background-color: #E9EEF3;*/
  min-width:100%;
  margin-left: 5px;
  margin-right: 5px;
  margin-top: 10px;
  /**  box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);*/
  position: inherit;
}


.el-main {
  /**  background-color: #FFFFFF;
   color: #333;*/
  width: 50%;
  margin-right: 5px;
  margin-top: 10px;
  margin-left: 5px;
  /** box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);*/
  position: inherit;
}
.el-aside,.el-main{
  /**  height: 765px;  */
  margin-bottom: 10px;
}
.text1{
  /**height: 600px;*/
  wihth:100%;
  border-radius: 1px;
  margin-bottom: 1px;
  /** overflow-y: hidden;
   overflow-x: hidden;
 /** box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
 */

}

.text2{
  height: 230px;
  width: 552px;
  border-radius: 4px;
  margin-bottom: 5px;
  /*  box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04); */
  position: inherit;
}
.text3{
  height: 155px;
  margin-top: 5px;
  margin-left: 5px;
  margin-right: 5px;
  border-radius: 4px;
  position: inherit;

}
.iconstyle{
  margin-top: 5px;
}
.position-fixed{
  position: inherit;
  margin-bottom: 5px;
  margin-top: 10px;
}
.listtable{
  margin-top: 1px;
  overflow-y: auto;
  overflow-x: hidden;
  position: inherit;
}
.divide{
  margin-top: 4px;
  margin-bottom: 10px;
}
.button-list1{
  /** text-align: center; */
}
.button-list2{
  margin-top: 5px;
  text-align: center;
  margin-bottom: 5px;

}
.button1{
  background-color: #ebd4ef;
  border: #9c26b0;
}


</style>


